<template>
    <div class="member-list">
        <div class="member-list-card">
            <div class="member-list-head">
                <Row :gutter="5" style="margin-bottom: 10px">
                    <!--<Col span="4">-->
                    <!--<DatePicker  clearable v-model="searchData.timeStartEnd" style="width: 100%" type="daterange" placeholder="时间筛选"></DatePicker>-->
                    <!--</Col>-->
                    <!--<Col span="4">-->
                    <!--<Input clearable v-model="searchData.loginName" placeholder="登录名" type="text"></Input>-->
                    <!--</Col>-->
                    <Col span="4">
                        <Input clearable v-model="searchData.userName" placeholder="用户名" type="text"></Input>
                    </Col>
                    <Col span="4">
                        <Input clearable v-model="searchData.userPhone" placeholder="用户电话" type="text"></Input>
                    </Col>
                    <!--<Col span="4">-->
                    <!--<Input clearable v-model="searchData.email" placeholder="邮箱" type="text"></Input>-->
                    <!--</Col>-->
                    <!--<Col span="4">-->
                        <!--<Select clearable v-model="searchData.userLevel" placeholder="会员等级">-->
                            <!--<Option :value="1">VIP会员</Option>-->
                            <!--<Option :value="2">金卡会员</Option>-->
                            <!--<Option :value="3">钻石会员</Option>-->
                            <!--<Option :value="4">红钻会员</Option>-->
                            <!--<Option :value="5">皇钻会员</Option>-->
                        <!--</Select>-->
                    <!--</Col>-->
                    <Col span="4">
                        <Select clearable v-model="searchData.userStatus" placeholder="帐号状态">
                            <Option :value="-1">冻结</Option>
                            <Option :value="99">未激活会员</Option>
                            <Option :value="1">正式会员</Option>
                        </Select>
                    </Col>
                    <!--</Row>-->
                    <!--<Row :gutter="5">-->
                    <!--<Col span="4">-->
                        <!--<Select clearable v-model="searchData.activeState" placeholder="激活状态">-->
                            <!--<Option :value="1">已激活</Option>-->
                            <!--<Option :value="2">未激活</Option>-->
                        <!--</Select>-->
                    <!--</Col>-->
                    <!--<Col span="4">-->
                    <!--<Select clearable v-model="searchData.svip" placeholder="是否是金牌代理">-->
                    <!--<Option :value="1">是</Option>-->
                    <!--<Option :value="0">否</Option>-->
                    <!--</Select>-->
                    <!--</Col>-->
                    <!--<Col span="4">-->
                    <!--<Select clearable v-model="searchData.is_daili" placeholder="是否是为区代">-->
                    <!--<Option :value="1">是</Option>-->
                    <!--<Option :value="0">否</Option>-->
                    <!--</Select>-->
                    <!--</Col>-->
                    <Col span="30">
                        <ButtonGroup class="subSearch">
                            <!--<Button @click="$router.push({name:'member-add-nocache'})" type="primary" icon="plus-round">新增</Button>-->
                            <Button :loading="search_loading" @click="searchGetList" type="primary">
                                <Icon type="ios-pulse-strong"></Icon>
                                筛 选
                            </Button>
                        </ButtonGroup>
                    </Col>
                </Row>
            </div>
            <i-table height="645" stripe :columns="columns" ref="tableCsv" :data="data"></i-table>
            <div style="padding: 15px;display: flex">
                <div>
                <Page @on-page-size-change="changeTiao" @on-change="changePage" :current="index" :total="total"
                      show-elevator show-sizer :placement="'top'" :page-size="page_con"
                      :page-size-opts="[10, 15, 20, 30, 40, 50]"></Page>
                </div>
                <div style="margin-left: 50px">
                    <Button @click="outexl" style="float: right" type="primary">导出表格</Button>
                </div>
            </div>
        </div>
        <!--激活-->
        <Modal v-model="modal9" width="360">
            <p slot="header" style="color:#f60;text-align:center">
                <Icon type="information-circled"></Icon>
                <span>激活确认</span>
            </p>
            <div style="text-align:center">
                <p>是否确认激活？</p>
            </div>
            <div slot="footer">
                <Button type="error" size="large" long :loading="modal_loading" @click="sureActive">确认激活</Button>
            </div>
        </Modal>
        <!--删除-->
        <Modal v-model="modal1" width="360">
            <p slot="header" style="color:#f60;text-align:center">
                <Icon type="information-circled"></Icon>
                <span>删除确认</span>
            </p>
            <div style="text-align:center">
                <p>是否继续删除？</p>
            </div>
            <div slot="footer">
                <Button type="error" size="large" long :loading="modal_loading" @click="del">删除</Button>
            </div>
        </Modal>
        <!--成为团队长-->
        <!--<Modal v-model="modal2" width="360">-->
        <!--<p slot="header" style="text-align:center">-->
        <!--<a>{{type==1?"成为团队长":"取消团队长"}}</a>-->
        <!--</p>-->
        <!--<div style="text-align:center">-->
        <!--<p>是否{{type==1?"成为团队长":"取消团队长"}}？</p>-->
        <!--</div>-->
        <!--<div slot="footer">-->
        <!--<Button type="primary" size="large" long :loading="modal_loading" @click="tuandui">确定</Button>-->
        <!--</div>-->
        <!--</Modal>-->
        <!--升级金牌-->
        <!--<Modal v-model="modal3" width="360">-->
        <!--<p slot="header" style="text-align:center">-->
        <!--<a>升级金牌</a>-->
        <!--</p>-->
        <!--<div style="text-align:center">-->
        <!--<p>是否升级金牌？</p>-->
        <!--</div>-->
        <!--<div slot="footer">-->
        <!--<Button type="primary" size="large" long :loading="modal_loading" @click="shengji">确定</Button>-->
        <!--</div>-->
        <!--</Modal>-->
        <!--修改密码-->
        <!--修改会员等级-->
        <Modal v-model="modal4" width="360">
            <p slot="header" style="text-align:center">
                <a>修改会员等级</a>
            </p>
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="70"
                  style="margin-top: 20px">
                <FormItem label="级别" prop="level">
                    <RadioGroup v-model="formValidate.level">
                        <Radio label="1">vip会员</Radio>
                        <Radio label="2">金卡会员</Radio>
                        <Radio label="3">钻石会员</Radio>
                        <Radio label="4">红钻会员</Radio>
                        <Radio label="5">皇钻会员</Radio>
                    </RadioGroup>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="changeLevel">确定</Button>
            </div>
        </Modal>
        <!--修改会员激活状态 status-->
        <Modal v-model="memberstatus" width="360">
            <p slot="header" style="text-align:center">
                <a>修改会员激活状态</a>
            </p>
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="70"
                  style="margin-top: 20px">
                <FormItem label="状态" prop="status">
                    <RadioGroup v-model="formValidate.status">
                        <Radio label="-2">冻结</Radio>
                        <Radio label="99">注册会员</Radio>
                        <Radio label="1">正式会员</Radio>
                    </RadioGroup>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="changeStatus">确定</Button>
            </div>
        </Modal>
        <!--查看会员资金-->
        <Modal v-model="getUserMoney" width="360">
            <p slot="header" style="text-align:center">
                <a>查看用户资金</a>
            </p>
            <!--<Form :label-width="70" style="margin-top: 20px">
                <FormItem label="冻结BBF" prop="money">
                    <Input v-model="moneylistes" readonly></Input>
                </FormItem>
            </Form>-->
            <Form :key="index" ref="formValidate" :model="formValidate"
                  :rules="ruleValidate" :label-width="70" style="margin-top: 20px">
                <FormItem :label="money.money_type_name" :prop="money.money_type_name" v-for="(money, index) in moneylist">
                    <Input v-model="money.num" readonly></Input>
                </FormItem>

            </Form>

            <!--<div slot="footer">-->
            <!--<Button type="primary" size="large" long :loading="modal_loading" @click="changeMoney">修改</Button>-->
            <!--</div>-->
        </Modal>
        <!--修改会员资金-->
        <Modal v-model="changeUserMoney" width="360">
            <p slot="header" style="text-align:center">
                <a>修改用户资金</a>
            </p>
            <Form :key="index" ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80"
                  style="margin-top: 20px">
                <FormItem label="资金种类" prop="change_money_type">
                    <Select clearable v-model="changeMoneyType" placeholder="资金种类">
                        <Option v-for="(money,index) in moneylist" :value="money.type" :key="index">{{money.money_type_name}}</Option>
                        <!--<Option :value="1">本金</Option>-->
                        <!--<Option :value="2">积分</Option>-->
                    </Select>
                </FormItem>
                <!--<FormItem label="资金种类" prop="change_money_type">-->
                    <!--<RadioGroup v-model="formValidate.change_money_type">-->
                        <!--<Radio label="1">本金</Radio>-->
                        <!--<Radio label="2">积分</Radio>-->
                    <!--</RadioGroup>-->
                <!--</FormItem>-->
                <FormItem label="增加/减少" prop="inc_type">
                    <RadioGroup v-model="formValidate.inc_type">
                        <Radio label="1">增加</Radio>
                        <Radio label="2">减少</Radio>
                    </RadioGroup>
                </FormItem>
                <FormItem label="更改数量" prop="num">
                    <Input v-model="formValidate.num" placeholder="请输入数量"></Input>
                </FormItem>

            </Form>
            <Input type="text" placeholder="备注" v-model="formValidate.remark"></Input>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="changeMoney">修改</Button>
            </div>
        </Modal>
        <!--<Modal v-model="get_myteam" width="360">
            <p slot="header" style="text-align:center">
                <a>修改会员等级</a>
            </p>
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="70"
                  style="margin-top: 20px">
                <FormItem label="级别" prop="level">
                    <RadioGroup v-model="formValidate.level">
                        <Radio label="1">vip会员</Radio>
                        <Radio label="2">金卡会员</Radio>
                        <Radio label="3">钻石会员</Radio>
                        <Radio label="4">红钻会员</Radio>
                        <Radio label="5">皇钻会员</Radio>
                    </RadioGroup>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="changeLevel">确定</Button>
            </div>
        </Modal>-->
        <Modal v-model="modal100" width="360">
            <p slot="header" style="text-align:center">
                <a>修改会员C2C挂单权限</a>
            </p>
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="70"
                  style="margin-top: 20px">
                <FormItem label="状态" prop="status">
                    <RadioGroup v-model="formValidate.type100">
                        <Radio label="1">开启</Radio>
                        <Radio label="2">关闭</Radio>
                    </RadioGroup>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="changeStatus100">确定</Button>
            </div>
        </Modal>
        <Modal v-model="modalJibie" width="360">
            <p slot="header" style="text-align:center">
                <a>修改级别</a>
            </p>
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="70"
                  style="margin-top: 20px">
                <FormItem label="级别" prop="level">
                    <i-select v-model="formValidate.level" style="width:200px">
                        <i-option value="0">普通用户</i-option>
                        <i-option value="1">初级经纪人</i-option>
                        <i-option value="2">中级经纪人</i-option>
                        <i-option value="3">高级经纪人</i-option>
                        <i-option value="4">合伙人</i-option>
                    </i-select>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="primary" size="large" long :loading="modal_loading" @click="sureChangeLevel">确定</Button>
            </div>
        </Modal>

    </div>
</template>
<script>
    export default {
        name: "member-list",
        data() {
            return {
                moneylist: {},
                moneylistes: '',
                modal100: false,
                columns: [
                    {
                        title: '序号',
                        type: 'index',
                        width: 60,
                        align: "center",
                    },
                    {
                        title: '用户名',
                        key: 'username',
                        align: "center",
                    },
                    {
                        title: '手机号码',
                        key: 'phone',
                        align: "center",
                    },
                    /*{
                        title: '真实姓名',
                        key: 'real_name',
                        align: "center",
                        render:(h,params)=>{
                            if (params.row.real_name == null || params.row.real_name == ''){
                                return '暂无'
                            }
                            else{
                                return params.row.real_name
                            }
                        }
                    },*/
                    {
                        title: '推荐人',
                        key: 'tuijian_name',
                        align: "center",
                    },
                    {
                        title: '直推人数',
                        key: 'p_num',
                        align: "center",
                    },
                    {
                        title: '团队人数',
                        key: 'team_num',
                        align: "center",
                    },
                    {
                        title: '团队业绩',
                        key: 'p_yeji',
                        align: "center",
                    },
                    {
                        title: '级别',
                        key: 'level_name',
                        align: "center",
                    },
                    {
                        title: '帐号状态',
                        key: 'status_name',
                        align: "center",
                    },
                    /*{
                        title: '会员C2C挂单权限',
                        key: 'is_c2c',
                        align: "center",
                        render: (h, params) => {
                            return params.row.is_c2c==1?'开启':'关闭'
                        }
                    },*/
                    {
                        title: '注册时间',
                        key: 'add_time',
                        align: "center",
                        render: (h, params) => {
                            return this.timeFormat(params.row.add_time)
                        }
                    },
                    {
                        title: '操作',
                        key: 'action',
                        align: 'center',
                        width: 400,
                        render: (h, params) => {
                            return h("div", [
                                h("ButtonGroup", {
                                    style: {
                                        marginTop: "5px"
                                    }
                                }, [
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: 'member-add-nocache',
                                                    query: {isEdit: true, uid: params.row.uid}
                                                })
                                            }
                                        }
                                    }, "编 辑"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.formValidate.status = "";
                                                this.uid = params.row.uid
                                                this.memberstatus = true
                                            }
                                        }
                                    }, "修改状态"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.uid = params.row.uid;
                                                this.getJsonData("UserMoney/getUserMoney", {
                                                    uid: params.row.uid,
                                                }).then((res) => {
                                                    // this.moneylistes = res.data.frozen_ffa
                                                    this.moneylist = res.data.usermoney.filter(item => item.is_show === '1');
                                                    this.getUserMoney = true
                                                });
                                            }
                                        }
                                    }, "查看资金"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.uid = params.row.uid;
                                                this.getJsonData("UserMoney/getUserMoney", {
                                                    uid: params.row.uid,
                                                }).then((res) => {
                                                    this.moneylist = res.data.usermoney.filter(item => item.is_show === '1');
                                                });
                                                this.changeUserMoney = true
                                            }
                                        }
                                    }, "修改资金"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: 'downList-nocache',
                                                    query: {isEdit: true, username: params.row.username}
                                                })
                                            }
                                        }
                                    }, "查看关系图"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.$router.push({
                                                    name: 'money-list-nocache',
                                                    query: {isEdit: true, uid: params.row.uid}
                                                })
                                            }
                                        }
                                    }, "查看财务"),
                                    h("Button", {
                                        props: {
                                            type: "primary"
                                        },
                                        on: {
                                            click: () => {
                                                this.uid = params.row.uid
                                                this.formValidate.level = params.row.level
                                                this.modalJibie = true
                                            }
                                        }
                                    }, "修改级别"),
                                ]),
                                h("ButtonGroup", {
                                    style: {
                                        margin: "5px 0px"
                                    }
                                }, [
                                ])
                            ])
                        }
                    }
                ],
                data: [],
                total: 0,
                index: 1,
                page_con: 15,
                searchData: {
                    timeStartEnd: [],//两个时间内的赛选
                    loginName: "",//
                    userName: "",
                    userPhone: "",//
                    userType: "",
                    sort: "",
                    userStatus: "",
                    svip: "",
                    is_daili: "",
                    uid: '',
                    email: '',
                    userLevel: '',
                    activeState:'',
                },
                remark: '',
                username: "",
                moneyTypeList:[],
                changeMoneyType:'',
                search_loading: false,
                id: "",
                type: 1,
                modal1: false,
                modal2: false,
                modal3: false,
                modal4: false,
                modal5: false,
                modal9: false,
                memberstatus: false,
                getUserMoney: false,
                modal_loading: false,
                changeUserMoney: false,
                get_myteam: false,
                formValidate: {
                    level: "",
                    status: "",
                    money: '',
                    change_money_type: '1',
                    inc_type: '1',
                    num: '',
                    remark: '',
                    type100: ''
                },
                ruleValidate: {
                    level: [{required: true, message: '请选择激活状态', trigger: 'change'}],
                    ststus: [{required: true, message: '请选择会员等级', trigger: 'change'}],
                    money: [{required: false, message: '请输入资金金额', trigger: 'blur'}],
                    change_money_type: [{required: true, message: '请选择资金种类', trigger: 'change'}],
                    inc_type: [{required: true, message: '请选择增加/减少', trigger: 'change'}],
                    num: [{required: true, message: '请输入资金金额', trigger: 'blur'}],
                    remark: [{required: false, message: '请输入备注', trigger: 'blur'}],
                    level2: [{required: false, message: '请选择级别', trigger: 'change'}],
                },
                formValidateAgent: {
                    areaId1: "",
                    areaId2: "",
                    areaId3: "",
                    tuijian: "",
                    type: "",
                },
                ruleValidateAgent: {
                    areaId1: [{required: true, message: '请选择省', trigger: 'change'}],
                    areaId2: [{required: true, message: '请选择市', trigger: 'change'}],
                    areaId3: [{required: true, message: '请选择县', trigger: 'change'}],
                    tuijian: [{required: true, message: '请输入推荐人', trigger: 'blur'}],
                    type: [{required: true, message: '请选择类型', trigger: 'change'}],
                },
                areaId1List: [],//省级
                areaId2List: [],//市级
                areaId3List: [],//县
                modalJibie: false
            }
        },
        activated() {
            this.getOrderList()
        },
        methods: {
            getOrderList() {
                this.getJsonData("User/index", {
                    is_jihuo:this.searchData.activeState,
                    level: this.searchData.userLevel,
                    status: this.searchData.userStatus,
                    email: this.searchData.email,
                    username: this.searchData.userName,
                    phone: this.searchData.userPhone,

                }, true)
                    .then((res) => {
                        this.data = res.user
                        this.total = parseInt(res.count)
                        this.search_loading = false
                    })
                    .catch((res) => {
                        this.search_loading = false
                    })
            },
            changePage(n) {
                this.index = n
                this.getOrderList()
            },
            changeTiao(num) {
                this.page_con = num
                this.index = 1
                this.getOrderList()
            },
            searchGetList() {
                this.search_loading = true
                this.index = 1
                this.getOrderList()
            },
            //删除
            del() {
                this.modal_loading = true;
                this.getJsonData("User/delUser", {uid: this.uid}, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.modal1 = false;
                        this.$Message.success('删除成功');
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modal1 = false;
                })
            },
            changeLevel() {
                this.sureChangeLevel()
            },
            //确认修改
            sureChangeLevel() {
                this.modal_loading = true;
                this.getJsonData("User/setUserLevel", {
                    uid: this.uid,
                    level: this.formValidate.level,
                }, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.modalJibie = false;
                        this.$Message.success("修改成功");
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modalJibie = false;
                })
            },
            //修改会员等级
            changeStatus() {
                this.sureChangeStatus()
            },
            //修改会员等级
            changeStatus100() {
                this.getJsonData("User/setUserIsC2C", {
                    type: this.formValidate.type100,
                    uid: this.uid,
                }, true)
                    .then((res) => {
                        this.$Message.success("修改成功");
                        this.modal100 = false
                        this.getOrderList()
                    }).catch((res) => {
                })
            },
            //确认修改
            sureChangeStatus() {
                this.modal_loading = true;
                this.getJsonData("User/setUserStatus", {
                    uid: this.uid,
                    status: this.formValidate.status,
                }, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.memberstatus = false;
                        this.$Message.success("修改成功");
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.memberstatus = false;
                })
            },
            //修改用户资金
            changeMoney() {
                this.sureChangeMoney()
            },
            //确认修改
            sureChangeMoney() {
                this.modal_loading = true;
                this.getJsonData("UserMoney/runUpdateUserMoney", {
                    uid: this.uid,
                    num: this.formValidate.num,
                    money_type: this.changeMoneyType,
                    inc_type: this.formValidate.inc_type,
                    desc: this.formValidate.remark,
                }, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.changeUserMoney = false;
                        this.$Message.success("修改成功");
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.changeUserMoney = false;
                })
            },
            getAreaId2() {
                if (this.formValidateAgent.areaId1 !== "") {
                    this.getJsonData("Areas/getAreas", {parentId: this.formValidateAgent.areaId1})
                        .then((res) => {
                            this.areaId2List = res.data
                        })
                } else {
                    this.areaId2List = []
                    this.areaId3List = []
                }
            },
            //获取县
            getAreaId3() {
                if (this.formValidateAgent.areaId2 !== "") {
                    this.getJsonData("Areas/getAreas", {parentId: this.formValidateAgent.areaId2})
                        .then((res) => {
                            this.areaId3List = res.data
                        })
                } else {
                    this.areaId3List = []
                }
            },
            //设为代理
            setAgent() {
                this.$refs.formValidateAgent.validate((valid) => {
                    if (valid) {
                        this.surSetAgent()
                    }
                })
            },
            //确认设为代理
            surSetAgent() {
                this.modal_loading = true;
                this.getJsonData("Users/addAgent", {
                    userId: this.id,
                    is_yuding: this.formValidateAgent.type,
                    tuijian: this.formValidateAgent.tuijian,
                    consignee_add_countyId: this.formValidateAgent.areaId1,
                    consignee_add_countyId2: this.formValidateAgent.areaId2,
                    consignee_add_countyId3: this.formValidateAgent.areaId3,
                }, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.modal5 = false;
                        this.$Message.success("设置成功");
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modal5 = false;
                })
            },
            reset() {
                this.$refs.formValidateAgent.resetFields();
            },
            //导出表格
            outexl(){
                this.$refs.tableCsv.exportCsv({
                    filename: '会员列表',
                    columns:  this.columns.filter((col, index) => index > 0),
                    data:this.data,
                });
            },
            sureActive(){
                this.modal_loading = true;
                this.getJsonData("User/jihuo", {uid: this.uid}, true)
                    .then((res) => {
                        this.getOrderList()
                        this.modal_loading = false;
                        this.modal9 = false;
                        this.$Message.success('激活成功');
                    }).catch((res) => {
                    this.modal_loading = false;
                    this.modal9 = false;
                })
            },
        },
    }
</script>
<style lang="less">
    @import "member-list";
</style>
